<%@ page language="java" contentType="text/html; charset=UTF-8"
	import="java.util.*" pageEncoding="UTF-8"%>
	<%String path=request.getContextPath(); %>
<!DOCTYPE html>

<html>

<head>
	<meta http-equiv="Content-Type" content="text/html;">
	<title>BONC员工管理</title>

	<jsp:include page="../../import.jsp"/>
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/tms/allChart.css">
	
	<link rel="stylesheet" type="text/css" href="<%=path%>/js/plugins/jeDate/skin/jedate.css">
	<script type="text/javascript" src="<%=path%>/js/plugins/jeDate/jquery.jedate.js"></script>
</head>
<body>

	  <jsp:include page="../dashboardHead.jsp"></jsp:include>
	 
	<div class="container">
		
		<div class="row">
				
			
			<div class="col-md-12 pandect_div"><!-- id="" class="table" -->
				
				<div>
					<div style="float:left;">
						<h4 style="width:220px;">部门薪资总览</h4>
					</div>
					
					 <div class="date-show-new" style="float:left;">
						<span class="wstxt">开始日期：</span><input type="text" class="workinput wicon" id="startPayOverview" readonly>
						<span class="wstxt">结束日期：</span><input type="text" class="workinput wicon" id="endPayOverview" readonly>
						<button class="btn btn-default" onclick="loadPayOverview();">查询</button>
						 
					</div> 
					<div style="width:100%; float:left; border-bottom: 1px solid #e4e4e4;margin-bottom: 10px;"></div>
				</div>
				
				<table id="PayOverview-table" class="table table-striped table-bordered table-hover" style="text-align: left;">
					<thead>
						<tr>
							 
							<th style="width: 30%;">部门名称</th>
							<th style="width: 10%;">部门人数</th>
							<th style="width: 10%;">薪酬成本</th>
							<th style="width: 10%;">人均工资</th>
							<th style="width: 10%;">社保福利成本</th>
							<th style="width: 10%;">人力成本</th>
						</tr>
					</thead>
					<tbody id="PayOverview_tbody">
						
					</tbody>
					
				</table>
				
					<!-- 页码变化 start-->
					<div class="pageNumber">
					
						 <input id="previousPayOverviewInput" type="hidden" name="previousPayOverviewInput" value=""> 
						 <input id="nextPayOverviewInput" type="hidden" name="nextPayOverviewInput" value=""> 
						 <input id="lastPayOverviewInput" type="hidden" name="lastPayOverviewInput" value=""> 
						 
						<button id="firstPayOverview" class="btn btn-default btn-sm" onclick="firstPayOverview();">首页</button>
						<button id="previousPayOverview" class="btn btn-default btn-sm" onclick="previousPayOverview();">上一页</button> 
						<button id="nextPayOverview" class="btn btn-default btn-sm "  onclick="nextPayOverview();">下一页</button>
						<button id="lastPayOverview" class="btn btn-default btn-sm"  onclick="lastPayOverview();">尾页</button>
						<span>当前第<span id="curPagePayOverview"></span>页</span>
						<span>共<span id="totalNumberPayOverview"></span>条记录</span> 
						<span>共<span id="totalPagePayOverview"></span>页</span>
						<span>每页<span id="pageSizePayOverview"></span>条</span>
					
					</div>
					<!-- 页码变化 end-->
			</div>

		</div>

	</div>
 
	 
	 <script src="<%=path%>/js/tms/turnChart/PayOverview.js"></script>
	<script>
		var start = {
		    format: 'YYYY-MM',
		    minDate: '1997-06', //设定最小日期为当前日期$.nowDate(0)
		    isinitVal:true,
		    festival:true,
		    ishmsVal:false,
		    maxDate: '2099-06', //最大日期
		    choosefun: function(elem,datas){
		        end.minDate = datas; //开始日选好后，重置结束日的最小日期
		    }
		};
		var end = {
		    format: 'YYYY-MM',
		    minDate: $.nowDate(0), //设定最小日期为当前日期
		    isinitVal:true,
		    festival:true,
		    ishmsVal:false,
		    maxDate: '2099-06', //最大日期
		    choosefun: function(elem,datas){
		        start.maxDate = datas; //将结束日的初始值设定为开始日的最大日期
		    }
		};
		$('#startPayOverview').jeDate(start);
		$('#endPayOverview').jeDate(end);
		
		 
	</script>
	
	 
</body>

</html>